<template>
    <div class="swiper">
        <swiper v-if="imgUrls.length > 0" 
            :indicator-dots="imgUrls.length > 0"  
            :ndicator-color="indicatorColor" 
            :indicator-active-color="indicatorActiveColor" 
            :autoplay="autoplay" 
            :interval="interval" 
            :duration="duration" 
            :circular="true"
        >
            <block v-for="(item, index) in imgUrls" :key="index" >
                <swiper-item>
                    <a :href="item.link">
                        <img :src="item.content" mode="aspectFill"/>
                    </a>
                </swiper-item>
            </block>
        </swiper>
    </div>
</template>

<script>

export default {
   props: ["imgUrls"],
   data(){
       return{
            indicatorColor: "white",
            autoplay: true,  //是否自动轮播
            interval: 3000,  //间隔时间
            duration: 500,  //滑动时间
            indicatorActiveColor: "#1A84FB",
       }
   }
}
</script>

<style lang="scss" scoped>
swiper{
    width:375px;
    height:135px;
    img{
        width:375px;
        height:135px;
        display: block;
    }
    
} 
</style>
